<template>
	<view class="sign_cont">
		<view class="rule_cont" @click="show=true">
			积分规则
		</view>
		<view class="sign_img">
			<!-- <image class="img" src="../../../static/images/sign.png" mode=""></image> -->
			<view class="sign_btn">
				<view class="btn_quan">
					<view class="text" :class="ishave?'bgover':'bgnull'" @click="ongetsignin">{{text}}</view>
				</view>
				<view class="btn_text">
					<text @click="tosigndetailFn">积分{{integral}}</text>
					<text class="nbsp">|</text>
					<text>当月已签到{{signNum}}天</text>
				</view>
			</view>
		</view>
		<!-- <sw-calendar @tapDate="tapDate"></sw-calendar> -->
		<model-calendar :sendYear="toYear" :sendMonth="toMonth" :dataSource="signData" :totalNum="sumCount"
			@dateChange="getData" @clickChange="clickSign">
		</model-calendar>
		<view class="task_cont">
			<view class="title">积分任务</view>
			<view class="task_item">
				<view class="_left">
					<!-- <view class=""><u-icon name="share-fill" color="#2979ff" size="44"></u-icon></view> -->
					<view class="left_text">
						<view class="day_text">分享好友</view>
						<view class="detail_text">分享微信好友注册成功 获取100积分</view>
					</view>
				</view>
				<view class="_right">
					<!-- <text class="">积分+100</text> -->
					<u-button class="custom-style" type="primary" shape="circle" size="mini" open-type="share" @click="goshareFn">去完成</u-button>
				</view>
			</view>
			<view class="task_item">
				<view class="_left">
					<!-- <view class=""><u-icon name="grid-fill" color="#2979ff" size="44"></u-icon></view> -->
					<view class="left_text">
						<view class="day_text" @click="">开通期货账户</view>
						<view class="detail_text">开通期货获取600积分</view>
					</view>
				</view>
				<view class="_right">
					<!-- <text class="">积分+600</text> -->
					<u-button class="custom-style" type="primary" shape="circle" size="mini" @click="goaCcount">去完成</u-button>
				</view>
			</view>
			<!-- <view class="task_item">
				<view class="_left">
					<view class=""><u-icon name="photo" color="#2979ff" size="40"></u-icon></view>
					<view class="left_text">
						<view class="day_text">每日分享</view>
						<view class="">分享当页签到内容</view>
					</view>
				</view>
				<view class="_right">
					<text class="">2积分</text><u-button class="custom-style" shape="circle" size="mini" >去完成</u-button>
				</view>
			</view> -->

		</view>
		<view class="bottom_text">
			我也是有底线的！！！
		</view>
		<u-popup v-model="show" width="75%" mode="center" border-radius="5" :closeable="true"
			:custom-style="customStyle">
			<view class="popup_cont">
				<view class="tit">
					———— <text class="text">积分规则</text> ————
				</view>
				<!-- <view class="cont_text">签到2个月可以活动一个策略购买，一天10个积分，600积分购买一个策略/月。 分享1个好友100分，分享6个注册的可以购买一个策略，新用户400积分，开通期货账户600积分 </view> -->
				<view class="cont_text">会员积分规则：</view>
				<view class="cont_text">1、每位用户每天仅签到1次</view>
				<view class="cont_text">2、会员账号每日登陆搜量网“签到”可得10积分</view>
				<view class="cont_text">3、会员积分可以在策略商城使用，可用于支持积分支付的策略产品</view>
				<view class="cont_text">4、积分抵扣只允许该会员账号持有人使用，不得借于他人（注册时必须填写真实姓名，以身份证为准）</view>
				<view class="cont_text">5、积分有效期1年，搜量网有权在法律法规认可的范围内对本活动进行解释。</view>
			</view>
		</u-popup>
		<u-popup width="60%" v-model="isSussce" mode="center" border-radius="5" :closeable="true"
			:custom-style="customStyle" close-icon-color="#3515e2">
			<view class="sign_sussce">
				<view class="title">
					签到成功
				</view>
				<view class="">
					恭喜你获得{{susscenum}} 积分
				</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	import modelCalendar from '@/components/message/Calendar.vue';
	import swCalendar from '@/components/sw-calendar/sw-calendar.vue'
	import {
		getsignin,
		getsigninday,
		useraCcumulate,
		shareinfo
	} from '@/api/site.js'
	import {
		toAccountOpenPage
	} from '@/utils/PageRouter.js'
	export default {
		data() {
			return {
				text: '签到',
				signNum: 0,
				integral: 0,
				show: false,
				isSussce: false,
				today: '',
				susscenum: 10,
				ishave: true,
				customStyle: {
					padding: "15px"
				},
				toYear: parseInt(new Date().getFullYear()), //本日
				toMonth: parseInt(new Date().getMonth() + 1), //本月
				sumCount: 0,
				signData: [],
				pid: ''
			};
		},
		components: {
			modelCalendar,
			swCalendar
		},
		created() {
			this.todayFn()
			//获取当前用户当前任务的签到状态  			
			this.getData(this.toYear + "-" + this.toMonth);
			this.getuseraCcumulate()
			this.pid = uni.getStorageSync('p_id')
			const t1 = [{
				"brokerlD": " 1080"
			}]
			uni.setStorageSync('bid',t1)
		},
		methods: {
			goaCcount() {
				toAccountOpenPage()
			},
			goshareFn() {
				let {
					id
				} = uni.getStorageSync('userinfo_key')
				this.pid = uni.getStorageSync('p_id')
				let that = this
				uni.showLoading({
					title: '加载中'
				});
				try {
					uni.share({
						provider: "weixin",
						scene: "WXSceneSession",
						type: 0,
						href: "https://wechat.sou-liang.com/#/addreg?staff_code=" + this.pid,
						title: "搜量网",
						summary: "国内顶尖的量化策略共享平台，可以任意查看收益高且稳定的高手策略、机构策略，以此丰富自己的投资思路。",
						imageUrl: "https://wo-zi.oss-cn-beijing.aliyuncs.com/2021/3/22/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20210323100446.png",
						success: function(res) {
							uni.hideLoading();
							shareinfo().then(res => {
								// that.susscenum=2
								// that.isSussce=true
								// that.staresTxet='今日已完成'
							})
						},
						fail: function(err) {
							uni.hideLoading();
							// error
						}
					});
				} catch (e) {
					uni.hideLoading();
					// error
				}

			},
			getuseraCcumulate() {
				useraCcumulate().then(res => {
					this.integral = res.data.member.accumulate_points
				})
			},
			tapDate(data) {
				//根据data.type进行判断用户点击的是哪一天,进行下一步业务操作
			},
			//获取日期
			todayFn() {
				let toDate = new Date()
				let day = toDate.getDate()
				if (day < 10) day = '0' + day;
				let year = toDate.getFullYear()
				// let mouth=toDate.getMonth()+1<10?'0'+toDate.getMonth()+1:toDate.getMonth()+1
				let mouth = toDate.getMonth() + 1
				if (mouth < 10) mouth = '0' + mouth;
				let toDay = year + '-' + mouth + '-' + day
				this.today = toDay
			},
			ongetsignin() {
				if (this.ishave) {
					getsignin().then(res => {
						this.clickSign(this.today)
						this.getuseraCcumulate()
						// this.getuseraCcumulate()
						// this.text='今日已签'
						// this.isSussce=true
						// this.ishave=false
						// getsigninday().then(res=>{
						// 	let num=res.data.length
						// 	this.signNum=num													
						// })
					})
				} else {
					uni.showToast({
						title: '今日已签过啦!',
						icon: 'none'
					})
				}
			},
			tosigndetailFn() {
				uni.navigateTo({
					url: './detai/detai'
				})
			},
			clickSign(day) {
				this.getuseraCcumulate()
				this.text = '今日已签'
				this.isSussce = true
				this.ishave = false
				getsigninday().then(res => {
					let num = res.data.length
					this.signNum = num
				})
				this.signData.push(day);
				this.sumCount++
				//this.$http.postHttp("Comment/UpdateRecord", day, (res) => {//可以通过后台接口添加当前用户当日打卡记录，
				// 		//if (res!= undefined) {
				// 			uni.showToast({
				// 				title: "打卡成功"+day,
				// 				icon: 'success',
				// 				duration: 2000
				// 			});
				// 		
				// 		//}
				//  })	
			},
			//当模板的时候可以直接引入，然后触发子组件事件到父界面去控制数据

			//获取当前用户该任务的签到数组
			getData(val) {
				let y = val.split('-')[0];
				let m = val.split('-')[1];
				//this.$http.postHttp("Comment/GetRecord", {//可以通过后台接口去获取你的打卡数据
				// 	Year: y,
				// 	Month: m,
				// }, (res) => {
				this.sumCount = 88; //res.SumCount				
				// if (y == this.toYear && m == this.toMonth) {
				getsigninday().then(res => {
					let num = res.data.length,
						newSign = [],
						today = new Date().getDate();
					this.signNum = num
					for (let i = 0; i < num; i++) {
						if (res.data[i].created_at > today) {
							break;
						}
						newSign.push(res.data[i].created_at)
					}
					if (this.today == newSign[0]) {
						this.text = '今日已签'
						this.ishave = false
					}
					this.signData = newSign;

				})
				//这是我造的假数据！！！
				// let num=["2","3","6","8","12","15"],newSign=[],today=new Date().getDate();
				// for(let i=0;i<6;i++){
				// 	if(parseInt(num[i])>today){
				// 		break;
				// 	}
				// 	newSign.push(y+"-"+m+"-"+num[i])
				// }

				// newSign //最后传给组件的格式看这里-------------
				// this.signData = newSign;
				// } else {
				//  	this.signData = [];
				// }
				// })
			},
		}
	}
</script>

<style lang="scss" scoped>
	.bgover {
		background-color: #2307bd;
	}

	.bgnull {
		background-color: #4b95e6;
	}

	.sign_cont {
		position: relative;
		overflow: hidden;

		.rule_cont {
			position: absolute;
			top: 70px;
			right: -10px;
			z-index: 99;
			margin: 30px 0;
			font-size: 12px;
			// background-color: #3e8ef7;
			background-color: #054598;
			padding: 4px 10px;
			line-height: 12px;
			border-radius: 10px;
			color: #fff;
		}

		.sign_img {
			width: 100%;
			height: 200px;
			padding-top: 80px;
			background-image: url("https://sou-liang.oss-cn-shanghai.aliyuncs.com/weixin/images/sign.png");
			background-size: 100% 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;

			.sign_btn {
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;

				.btn_quan {
					width: 80px;
					height: 80px;
					background-color: #FFF;
					border-radius: 50%;

					.text {
						margin: 4px 0 0 4px;
						// background-color: #2307bd;
						width: 72px;
						height: 72px;
						border-radius: 50%;
						display: flex;
						justify-content: center;
						align-items: center;
						color: #fff;
					}
				}

				.btn_text {
					color: #fff;
					margin-top: 10px;

					.nbsp {
						margin: 0 5px;
					}
				}
			}

			.img {
				width: 100%;
			}
		}

		.bottom_text {
			margin: 10px;
			text-align: center;
			font-size: 12px;
			color: #737373;
		}

		.task_cont {
			width: 100%;
			padding: 10px;

			.title {
				color:#2979ff ;
				text-align: left;
				margin: 20px 0 30px;
				border-radius: 10px;
				font-size: 18px;
				// color: #2307bd;
				font-weight: bold;
			}

			.task_item {
				width: 100%;
				color: #040729;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 15px 15px;
				box-shadow: rgba(0, 0, 0, .3) 0px 0px 5px;
				margin-top: 10px;
				font-size: 14px;
				background-color: #ffffff;
				border-radius: 8px;

				._left {
					display: flex;
					justify-content: center;
					align-items: center;

					.left_text {

						// margin-left: 10px;
						.day_text {
							font-size: 16px;
							font-weight: bold;
							margin-bottom: 5px;
						}

						.detail_text {
							font-size: 12px;
							color: #B6B6B6;
						}
					}
				}

				._right {
					display: flex;
					align-items: center;
				}
			}
		}
	}

	// .custom-style {
	// 	width: 60px;
	// 	color: #fff;
	// 	background-image: linear-gradient(to right, #2307BD, #6694dc);
	// 	margin-left: 10px;
	// }

	.popup_cont {
		padding: 25px 15px;

		.tit {
			text-align: center;
			margin-bottom: 10px;

			.text {
				font-size: 16px;
				font-weight: bold;
				margin: 0 5px;
			}
		}

		.cont_text {
			font-size: 12px;
			margin-top: 10px;
		}
	}

	.sign_sussce {
		padding: 30px;
		text-align: center;
		color: #3515e2;

		.title {
			font-size: 16px;
			margin-bottom: 10px;
		}
	}
</style>
